<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" th:with="tit='图书信息管理'">

<head th:replace="header::headFregment(${tit})">
</head>
<body>
    <div th:replace="header::header"></div>
    <div th:replace="header::nav"></div>

    <div class="content">
        <div class="container-fluid">
             <div class="row-fluid">
                 <blockquote>
                     <p style="font-size: 24px;margin: 20px">学生信息列表</p>
                 </blockquote>

                 <div>
                     <div style="float: left;width: 90px"><button type="button" class="btn btn-danger" data-toggle="modal" data-target="#myModal">添加图书</button></div>
                     <div style="float: right; width: 360px">
                         <form class="form-horizontal" th:action="index">
                             <input type="text" style="width: 90px" name="bnum" id="bnum" placeholder="请输入书本编号" class="form-control">
                             <input type="text" style="width: 80px" name="bname" id="bname" placeholder="请输入书名" class="form-control">
                             <input type="text" style="width: 80px" name="bauthor" id="bauthor" placeholder="请输入作者" class="form-control">
                             <input type="text" style="width: 90px"  name="bpress" id="bpress" placeholder="请输入出版社" class="form-control">
                             <button type="submit" class="btn btn-warning form-control">查找图书</button>
                         </form>
                     </div>
                 </div>

                 <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                     <div class="modal-dialog">
                         <div class="modal-content">
                             <div class="modal-header">
                                 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                 <h4 class="modal-title" id="myModalLabel">添加图书</h4>
                             </div>
                             <div class="modal-body">
                                 <form class="form-horizontal" id="addform">
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">书本编号:</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bnum" id="bnum1"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">书名:</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bname" id="bname1"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">作者：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bauthor" id="bauthor1"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">出版社：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bpress" id="bpress1"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">价格：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bprice" id="bprice1"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">类目：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="btype" id="btype1"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">书本总量：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bsnum" id="bsnum1"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">借出数量：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bloan" id="bloan1"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">剩余数量：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bres" id="bres1"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">所在位置（柜号）：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="blocation" id="blocation1"></div>
                                     </div>
                                 </form>
                             </div>
                             <div class="modal-footer">
                                 <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                                 <button type="button" class="btn btn-primary" id="addbtn">确定添加</button>
                             </div>
                         </div><!-- /.modal-content -->
                     </div><!-- /.modal -->
                 </div>

                 <table class="table table-striped table-hover table-bordered" align="center">
                     <tr>
                         <th>序号</th>
                         <th>书本编号</th>
                         <th>书名</th>
                         <th>作者</th>
                         <th>出版社</th>
                         <th>价格</th>
                         <th>类目</th>
                         <th>库存总量</th>
                         <th>借出数量</th>
                         <th>剩余数量</th>
                         <th style="width: 8%">所在位置（柜号）</th>
                         <th>操作</th>
                     </tr>
                     <tr th:each="b:${pageInfo.list}">
                         <td th:text="${bStat.count}">1</td>
                         <td th:text="${b.bnum}">书本编号</td>
                         <td th:text="${b.bname}">书名</td>
                         <td th:text="${b.bauthor}">作者</td>
                         <td th:text="${b.bpress}">出版社</td>
                         <td th:text="${b.bprice}">价格</td>
                         <td th:text="${b.btype}">类目</td>
                         <td th:text="${b.bsnum}">库存总量</td>
                         <td th:text="${b.bloan}">借出数量</td>
                         <td th:text="${b.bres}">剩余数量</td>
                         <td th:text="${b.blocation}">所在位置（柜号）</td>
                         <td>
                             <a data-toggle="modal" data-target="#editModal" style="cursor: pointer" onclick="changeLibrary(this)"><span class="icon-edit"></span>编辑</a><input type="hidden" th:value="${b.bid}">&nbsp;&nbsp;&nbsp;&nbsp;
                             <a th:onclick="'delBok('+${b.bid}+')'" style="cursor: pointer"><span class="icon-remove"></span>删除</a>
                         </td>
                     </tr>
                 </table>
                 <div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                     <div class="modal-dialog">
                         <div class="modal-content">
                             <div class="modal-header">
                                 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                 <h4 class="modal-title" id="myModalLabel">修改图书信息</h4>
                             </div>
                             <div class="modal-body">
                                 <form class="form-horizontal" id="editform">
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">书本编号:</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bnum" id="bnum2"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">书名:</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bname" id="bname2"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">作者：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bauthor" id="bauthor2"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">出版社：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bpress" id="bpress2"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">价格：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bprice" id="bprice2"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">类目：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="btype" id="btype2"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">书本总量：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bsnum" id="bsnum2"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">借出数量：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bloan" id="bloan2"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">剩余数量：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="bres" id="bres2"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2">所在位置（柜号）：</label>
                                         <div class="col-lg-10"><input type="text" class="form-control" name="blocation" id="blocation2"></div>
                                     </div>
                                     <div class="form-group" style="margin-top: 20px">
                                         <label class="control-label col-lg-2"><input type="hidden" name="bid" id="bid2"></label>
                                     </div>
                                 </form>
                             </div>
                             <div class="modal-footer">
                                 <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                                 <button type="button" class="btn btn-primary" id="editbtn">确定修改</button>
                             </div>
                         </div><!-- /.modal-content -->
                     </div><!-- /.modal -->
                 </div>

                 <input type="hidden" th:value="${pageInfo.pageNum}" id="pagenum">

                 <div th:replace="page::pageFragment"></div>

              </div>
        </div>
        <div class="container-fluid">
            <div class="row-fluid">
                <footer th:replace="footer::footer"></footer>
            </div>
        </div>
    </div>
</body>
</html>
<script>
    function delBok(bid) {
        $.ajax({
            url: 'deleteBok',
            data: {id: bid},
            type: 'post',
            datatype: 'json',
            success:function (res) {
                if (res.result > 0) {
                    alert("删除成功！");
                    window.location.reload();
                } else {
                    alert("删除失败，请联系管理员！");
                }
            },
            error: function () {
                alert("通讯失败，请检查网络！");
            }
        });
    }
</script>
<script>
    $("#addbtn").click(function () {
        $.ajax({
            url:'/doAddBok',
            type:'post',
            data:$("#addform").serialize(),
            success:function (result) {
                if (result.res=='success'){
                    alert("添加成功！");
                    location.href="/index";
                } else {
                    if (result.res=='had'){
                        alert("学号已存在！");
                    }else{
                        alert("添加失败！");
                    }
                }
            },
            error:function () {
                alert("通讯失败！");
            }
        });
    });
</script>
<script>
    function changeLibrary(obj){
        var ur = '/editBok/'+obj.nextSibling.value;
        $.ajax({
            url:ur,
            type:'post',
            success:function (res) {
                console.log(res);
                $('#bname2').val(res.book.bname);
                $('#bnum2').val(res.book.bnum);
                $('#bauthor2').val(res.book.bauthor);
                $('#bpress2').val(res.book.bpress);
                $('#bprice2').val(res.book.bprice);
                $('#btype2').val(res.book.btype);
                $('#bloan2').val(res.book.bloan);
                $('#bres2').val(res.book.bres);
                $('#blocation2').val(res.book.blocation);
                $('#bsnum2').val(res.book.bsnum);
                $('#bid2').val(res.book.bid);
            },
            error:function () {
                console.log("通讯失败！")
            }
        });
    }
</script>
<script>
    $("#editbtn").click(function () {
        $.ajax({
            url:'/doEditBok',
            type:'post',
            data:$("#editform").serialize(),
            success:function (result) {
                if (result.res=='success'){
                    alert("修改成功！");
                    location.href="/index?pageNum="+$('#pagenum').val();
                } else {
                    alert("修改失败！");
                }
            },
            error:function () {
                alert("通讯失败！");
            }
        });
    });
</script>